<template name="asnReceiveRFDetailListPage">
	<view>
		<cu-custom bgColor="bg-gradual-blue" :isBack="true" backRouterName="asnReceiveRFListPage">
			<block slot="content">ASN收货明细</block>
		</cu-custom>
		<view class="cu-bar bg-gradual-blue search">
			<view class="search-form radius">
				<text class="cuIcon-search"></text>
				<input :adjust-position="false"  v-model="searchParam" @input="onInput"  type="text" placeholder="物料编码或名称" confirm-type="search" @confirm="search()"></input>
			</view>
		</view>
		<view class="cu-card article"v-for="(item,index) in receiveDetailList" @tap="chooseAsnDetail(item)">
			<view class="cu-item shadow bg-gradual-blue">
				<view class="title">
					<view class="text-cut text-center text-mauve text-bold" style="font-size: 18px;">{{item.itemName}}</view>
				</view>
				<view class="content">
					<view class="desc">
						<view class="text-gray text-sm flex">
							<view class="text-cut">
								<text class="text-white text-bold margin-left-xs" style="font-size: 15px;">[物料编码]：{{item.itemCode}}</text>
							</view> 
						</view>
						<view class="text-gray text-sm flex">
							<view class="text-cut">
								<text class="text-white text-bold margin-left-xs" style="font-size: 15px;">[包装名称]：{{item.packageName}}</text>
							</view> 
						</view>
						<view class="text-gray text-sm flex">
							<view class="text-cut">
								<text class="text-white text-bold margin-left-xs" style="font-size: 15px;">[收货数量]：{{item.percentQty}}</text>
							</view> 
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import crypto from '@/api/crypto.js' 
	export default {
		data() {
			return {
				searchParam:'',
				myFormData:{
					asnId:'',
					asnCode:'',
					detailId:'',
					itemCode:'',
					itemName:'',
					packageName:'',
					percentQty:'',
					customerBill:'',
					receiveLoc:'',
					totalQty:0,
					recived:0,
					palletNo:'',
				},
				receiveDetailList:[],
				receiveDetailUrl:'/pda/initReceiveDetailList'
			}
		},
		onLoad:function(option){
			if(!option.item){
				uni.navigateTo({
					url: '/pages/wms/asnReceiveRFListPage'
				});
			}
			const tempItem = JSON.parse(decodeURIComponent(option.item));
			this.myFormData = tempItem 
			this.initReceiveDetailList();
		},
		methods: {
			initReceiveDetailList(){
				this.$http.get(this.receiveDetailUrl,{params:{asnId:crypto.encrypt(this.myFormData.asnId),searchParam:crypto.encrypt(this.searchParam),palletNo:crypto.encrypt(this.myFormData.palletNo)}}).then(res=>{
				  if(res.data.success){
					this.receiveDetailList = res.data.result;
				  }
				})
			},
			onInput(e){
				this.searchParam = e.target.value
			},
			chooseAsnDetail(item){
				uni.navigateTo({
					url: '/pages/wms/asnReceiveRFDetailInputPage?item='+ encodeURIComponent(JSON.stringify(item))
				});
			},
			search(){
				this.initReceiveDetailList();
			}
		}
	}
</script>
<style>
.cu-item animation-slide-bottom{
	height: 500px !important;
}
</style>

